/** @jsxImportSource @emotion/react */
import * as React from "react";
import {css} from "@emotion/react";
import {
  CCell, Cell, Table, TableBody, TableRow, Text, TableHead, TextArea, BlobInputList,
} from "customize-easy-ui-component";
import {InspectRecordLayout, InternalItemProps, RepLink, useItemInputControl} from "../../common/base";
import {TailMenRowIspCheck} from "../../contain/rarelyVary";
import {useMeasureInpFilter} from "../../common/hooks";
import {objNestSet} from "../../../common/tool";
import {useOmnipotentPrefCs, useOmnipotentPrefTitle} from "../../hook/useOmnipotentPref";
import {tail附页} from "./orcBase";

const items检验项 = [
    ['变资料', [{t:'技术资料和文件',s:6}], '氧舱、配套压力容器制造、安装、改造和新增加或者有变更的资料', ],
    ['培训情', [{}], '使用登记以及安全管理、维护保养人员培训记录、人员资格证，持证上岗以及操作人员培训情况',  ],
    ['仪表检定', [{}], '历次定期检验报告、安全附件与安全保护装置及仪表校验或者检定记录、报告', ],
    ['保养记', [{}], '操作规程、管理制度以及运行、维修保养记录', ],
    ['年度检', [{}], '本检验周期内的年度检查报告', ],
    ['问题整改', [{}], '上次定期检验的检验报告以及本年度检查提出问题的整改记录、报告', ],
    ['有机玻', [{t:'舱体',s:6}], '舱体、观察（照明）窗采用的有机玻璃材料有无明显划伤和肉眼可见的银纹等缺陷' ],
    ['阻燃静电', [{}], '上次定期检验后，舱内物料发生变化的，确认其所变更材料的难燃或者阻燃性以及抗静电性能', ],
    ['密封老', [{}], '舱门以及递物筒密封圈有无老化、变形情况' ],
    ['导静电', [{}], '医用氧气加压舱舱内导静电装置以及连接情况' ],
    ['传感采集', [{}], '舱内各传感器数据采集口的畅通与保护以及采集管路与传感器连接情况' ],
    ['气密试', [{}], '气密性试验' ],
    ['急排放装', [{t:'压力调节系统与呼吸气系统',s:4}], '舱内外部设置的应急排放装置开启、关闭是否灵敏、可靠以及警示标志' ],
    ['管阀门', [{}], '压力调节系统与呼吸气系统管道和相关阀门开启、关闭情况' ],
    ['调节阀', [{}], '舱内呼吸气体调节阀工作情况' ],
    ['介质质量', [{}], '检验压力介质质量' ],
    ['急电源', [{t:'电气系统',s:3}], '测试应急电源装置自动投入使用功能' ],
    ['电源保证', [{}], '应急电源装置是否能保证应急呼叫、应急照明、通讯对讲、呼吸气体浓度测定等装置连续工作的时间' ],
    ['电气元件', [{}], '在定期检验周期内发生电气系统改变，所改变的电气元器件、电线(缆)有关质量证明资料和其隐蔽性以及防护情况' ],
    //拆分点
    ['通讯对讲', [{t:'电气系统',s:3}], '通讯对讲装置的通话情况' ],
    ['声光报警', [{}], '测试应急呼叫装置启动时，控制台上声光报警信号显示以及由舱外操作人员手动操作才能解除的情况' ],
    ['照明设', [{}], '照明装置设置以及工作情况' ],
    ['温度传感', [{t:'舱内环境调节系统',s:2}], '舱内温度传感器防护情况' ],
    ['温湿显示', [{}], '控制台上的温度、湿度显示情况' ],
    ['消防器材', [{t:'消防系统',s:3}], '舱内外部消防器材的种类、有效期', ],
    ['喷淋消', [{}], '水喷淋消防系统的工作状态',  ],
    ['消防开关', [{}], '水喷淋消防系统控制开关的保护情况', ],
    ['气浓度测', [{t:'安全附件与安全保护装置及仪表',s:7}], '呼吸气体浓度测定、记录装置的设置', ],
    ['浓度传感', [{}], '呼吸气体浓度测定装置的精度、测量范围、呼吸气体浓度传感器的种类和有效期情况' ],
    ['浓度报警', [{}], '呼吸气体浓度测定装置所设定的上下限报警点和报警功能' ],
    ['阀表有效', [{}], '安全阀、氧气专用压力表、压力表等的有效期' ],
    ['换安附件', [{}], '定期检验周期内更换安全附件和安全保护装置及仪表的，确认其性能以及功能(与介质相适应、测量精度等)' ],
    ['门联锁', [{}], '测试快开门式结构舱门、递物筒的安全联锁装置' ],
    ['接地阻测', [{}], '舱体与接地装置的连接情况和测试接地电阻值' ],
    ['配套容器', [{t:'配套压力容器',s:1}], '按照《固定式压力容器安全技术监察规程》中定期检验的规定' ],
];

export const itemA检验项: string[] = ['附页说明' ];
items检验项.forEach(([name, title, initIsp], i: number) => {
  itemA检验项.push(name as string);
});
const 检查结果选=['√', '×', '—', '无此项'];
interface Props extends InternalItemProps {
    part?: number;     //最末尾的注释的文本使用那一段话？可选择办法的。
}
const config项目上=items检验项.slice(0,19);
const config项目下=items检验项.slice(19);
export const AppendixPage =
    React.forwardRef((
        {children, show, alone = true, refWidth, label, part=1}: Props, ref
    ) => {
      const {inp, setInp} = useItemInputControl({ref});
      const [getInpFilter] = useMeasureInpFilter(null, itemA检验项,);
      const config= 1===part? config项目上 : config项目下;
      const titNode=useOmnipotentPrefTitle({config, baseSeq: 1===part? 0:19});
      return (
          <InspectRecordLayout inp={inp} setInp={setInp} getInpFilter={getInpFilter} show={show}
                               alone={alone} label={label!}>
            <Text variant="h5">{label}：</Text>
            {config.map(([name, _1, _2, unit]: any, i: number) => {
              return (<React.Fragment key={i}>
                <div css={{display: 'flex', flexWrap: 'wrap', alignItems: 'center'}}>
                  {titNode[i]}
                  <div css={{display: 'inline-flex', alignItems: 'center', flexWrap: 'wrap'}}>
                    检查结果：
                    <BlobInputList value={inp?.[name]?.r || ''} datalist={检查结果选} rows={1}
                                   style={{display: 'inline-flex', width: '9rem', maxWidth: '100%', fontSize: '1rem',}}
                                   listStyle={css({fontSize: '1rem',})}
                                   onListChange={v => objNestSet(name, 'r', v || undefined, inp, setInp)}/>
                  </div>
                  <div css={{display: 'inline-flex', alignItems: 'center', flexWrap: 'wrap'}}>
                    备注：
                    <BlobInputList value={inp?.[name]?.m || ''}  rows={2}
                                   style={{display: 'inline-flex', width: '16rem', maxWidth: '100%',}}
                                   onListChange={v => objNestSet(name, 'm', v || undefined, inp, setInp)}/>
                  </div>
                </div>
              </React.Fragment>);
            })}
            <hr/>
            说明：
            <TextArea  value={inp?.附页说明 ||''} rows={6}
                       onChange={e => setInp({ ...inp, 附页说明: e.currentTarget.value||undefined}) } />
            {children}
          </InspectRecordLayout>
      );
  });

const tailRender = (orc: any, name: string, lix: number, unit: any) => {
  const nneedbig = orc?.[name]?.r?.length >= 3 || (!orc?.[name]?.r);
  return <>
    <CCell><Text css={{fontSize: nneedbig ? '0.875rem' : '1.15rem'}}>{orc?.[name]?.r ?? '／'}</Text></CCell>
    <CCell>{orc?.[name]?.m ?? '／'}</CCell>
  </>;
}

//检验报告附页；
export const AppendixPageVw = ({orc, rep}: { orc: any, rep: any }
) => {
  const [renderP1,renderP2] = useOmnipotentPrefCs({orc, config: items检验项,
                      split:[18],tag:'ApxIspItms', tailRender, pcols: 1, noNo: false, unitCel: false});
  return <>
    <div css={{"@media print": {paddingBottom: '5.5rem', pageBreakInside: 'avoid'}}}>
      <Text id='AppendixPage' variant="h2" css={{textAlign: 'center', marginTop: '1rem',
      }}>氧舱定期检验报告附页</Text>
      <div css={{display: 'flex', justifyContent: 'space-between'}}>
        <Text></Text>
        <Text>报告编号：{rep.isp.no}</Text>
      </div>
    </div>
    <Table fixed={ ["3.6%", "9%", "%",  "15%","21%"] }
              css={{borderCollapse: 'collapse', "@media print": {marginTop: '-5.5rem'}}} tight miniw={800}>
      <TableHead>
        <TableRow>
          <CCell><Text css={{fontSize: '0.75rem'}}>序号</Text></CCell><CCell colSpan={2}>检验项目与内容</CCell><CCell>检查结果</CCell><CCell>备注</CCell>
        </TableRow>
      </TableHead>
      <TableBody>
        <RepLink rep={rep} tag={'AppendixPage'}>
          {renderP1}
        </RepLink>
        <RepLink rep={rep} tag={'ApxIspItms_20'}>
          {renderP2}
          <TableRow>
            <Cell split={true} colSpan={5}>
              <div css={{minHeight: '2rem', whiteSpace: 'pre-wrap'}}>
                 &nbsp; 说明：<br/>{orc?.附页说明 || '／'}
              </div>
            </Cell>
          </TableRow>
        </RepLink>
      </TableBody>
    </Table>
    <TailMenRowIspCheck  orc={orc} rep={rep} href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProjectList#ProjectList`}>
    </TailMenRowIspCheck>
    {tail附页}
  </>;
};
